﻿.MarkupToolbarContainer
{
	padding: 5px 5px 5px 5px;
	background-color: #f3f3f3;
	font-size: 0;
	overflow: hidden;
}

.MarkupButton
{
	color: #6e6e6e;
	font: bold 12px Helvetica, Arial, sans-serif;
	text-decoration: none;
	padding: 7px 12px;
	position: relative;
	display: inline-block;
	text-shadow: 0 1px 0 #fff;
	background: #f3f3f3;
	border: solid 1px #dcdcdc;
	border-radius: 2px;
	margin-right: 8px;
	cursor: pointer;
	z-index: 1000;
}

.MarkupButton:active
{
	background-color: lightgrey;
	border-color: #999;
}

span.MarkupButton:hover
{
	color: #333;
	border-color: #999;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}

span.MarkupButton:active
{
	color: #000;
	border-color: #444;
}

.MarkupButtonDisabled
{
	color: #6e6e6e;
	font: bold 12px Helvetica, Arial, sans-serif;
	text-decoration: none;
	padding: 7px 12px;
	position: relative;
	display: inline-block;
	text-shadow: 0 1px 0 #fff;
	background: #f3f3f3;
	border: solid 1px #dcdcdc;
	border-radius: 2px;
	margin-right: 8px;
	cursor: pointer;
	z-index: 1000;
}

/*---------------------------------------------------------------*/
/*-------------------------SVG styles----------------------------*/

.SvgSurface
{
	position: absolute;
	top: 0;
	left: 0;
	background-color: rgba(255, 255, 255, 0);
	z-index: 100000;
}

.CircleResizeElement
{
	stroke: rgb(0, 0, 0);
	stroke-width: 1;
	fill: rgb(0, 150, 253);
}

.BoundingRectResizeElement
{
	stroke: rgb(0, 150, 253);
	stroke-width: 2;
	fill: none;
}

.SelectableMarkup
{
	cursor: move;
}

.SelectMode
{
	cursor: crosshair;
}
/*---------------------------------------------------------------*/

.RefreshFeedButton
{
	background: url(../../../images/Refresh.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.MakeCommentMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_comment.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.NewCommentMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_comment_new.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.ExitMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_exit.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.HighlightMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_highlight.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.TextMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_text.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.LineMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_line.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.ScribbleMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_scribble.png) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.ArrowMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_line_with_arrow.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.NotFilledBoxMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_box_not_filled.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.FilledBoxMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_box_filled.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.NotFilledEllipseMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_ellipse_not_filled.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.FilledEllipseMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_ellipse_filled.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.SolidMediumMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_solid_medium.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.SolidThickMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_solid_thick.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.SolidThinMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_solid_thin.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.DashedMediumMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_dashed_medium.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.DashedThickMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_dashed_thick.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.DashedThinMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_dashed_thin.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.SolidThinMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_solid_thin.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.SelectMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_select.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.ClearMarkupButton
{
	background: url(../../../images/markuptoolbar/markup_comment_new.svg) no-repeat #f3f3f3 center;
	background-size: 24px;
	width: 12px;
	height: 12px;
}

.MarkupToolbarSeparator
{
	height: 20px;
	border: 1px solid black;
}

span.TriangleMarkupToolbar
{
	background: url(../../../images/markuptoolbar/others/black_triangle.svg) no-repeat #f3f3f3 center;
	background-size: 8px;
	width: 10px;
	height: 26px;
	padding: 0;
}

span.LeftMarkupButton
{
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	margin-right: 0;
}

span.RightMarkupButton
{
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

span.MarkupColorPicker
{
	width: 15px;
	height: 15px;
	display: inline-block;
	background-color: green;
	margin-right: 8px;
	margin-bottom: 5px;
	cursor: pointer;
}

span.MarkupButtonWithColorPicker
{
	margin-right: 5px;
}

textarea.MarkupTextualMessageInput
{
	margin-right: 8px;
	border: 1px solid #808080;
	overflow: auto;
	resize: none;
}

textarea.MarkupTextualMessageInput:focus
{
	outline: 1px solid #808080;
}

textarea.EmptyMarkupTextualMessageInput
{
	color: darkgray;
}

span.MarkupPressedButton
{
	background-color: lightgrey;
	border-color: #999;
}

span.TopMenuItem
{
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}

span.MiddleMenuItem
{
	border-radius: 0;
}

span.BottomMenuItem
{
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

span.MarkupToolbarSeparator
{
	border-left: 1px solid #000;
	height: 26px;
	display: inline-block;
	margin-right: 8px;
}

.hidden
{
	display: none;
}

.MenuContainer
{
	position: absolute;
	z-index: 1000000;
}

#EditableTextHelper
{
	position: absolute;
	font-family: Arial;
	overflow: hidden;
	background-color: RGBA(255, 255, 255, 1);
	z-index: 100000;
	border: 2px solid rgb(0, 150, 253);
}
